import type { App } from 'vue'
import { useUserStore } from '@/stores/userStore'
import { judementSameArr } from '@/utils/arrayOperation'

/**
 * 用户权限指令
 * @directive 单个权限验证（v-perm="xxx"）
 * @directive 多个权限验证，满足一个则显示（v-perms="[xxx]"）
 * @directive 多个权限验证，全部满足则显示（v-perm-all=[xxx,xxx]）
 * @param app
 */
export function permDirective(app: App) {
    // 单个权限验证（v-perm="xxx"）
    app.directive('perm', {
        mounted(el, binding) {
            const userStore = useUserStore()
            const authBtnList = userStore.userInfo.authBtnList || []
            if (!authBtnList.some((v: string) => v === binding.value))
                el.parentNode.removeChild(el)
        },
    })

    // 多个权限验证，满足一个则显示
    app.directive('perms', {
        mounted(el, binding) {
            let flag = false
            const userStore = useUserStore()
            userStore.userInfo.authBtnList.map((val: string) => {
                binding.value.map((v: string) => {
                    if (val === v) flag = true
                })
            })
            if (!flag) el.parentNode.removeChild(el)
        },
    })

    // 多个权限验证，全部满足则显示（v-auth-all="[xxx,xxx]"）
    app.directive('perm-all', {
        mounted(el, binding) {
            const userStore = useUserStore()
            const flag = judementSameArr(
                binding.value,
                userStore.userInfo.authBtnList,
            )
            if (!flag) el.parentNode.removeChild(el)
        },
    })
}
